<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>发型工作室-员工详情</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/font-awesome/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    <!-- DataTables -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/datatables/dataTables.bootstrap4.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="../util/AdminLTE/dist/css/adminlte.min.css">
    <!-- iCheck -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/iCheck/flat/blue.css">
    <!-- Morris chart -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/morris/morris.css">
    <!-- jvectormap -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/jvectormap/jquery-jvectormap-1.2.2.css">
    <!-- Date Picker -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/datepicker/datepicker3.css">
    <!-- Daterange picker -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/daterangepicker/daterangepicker-bs3.css">
    <!-- bootstrap wysihtml5 - text editor -->
    <link rel="stylesheet" href="../util/AdminLTE/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
    <!-- 主CSS -->
    <link rel="stylesheet" type="text/css" href="../util/css/main.css">
    <!-- 公共类CSS -->
    <link rel="stylesheet" type="text/css" href="../util/css/public.css">
</head>
<body onload="showPassword();">

<div class="wrapper">

    <!-- 头部 -->
<nav class="main-header navbar navbar-expand bg-white navbar-light border-bottom">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link" data-widget="pushmenu" href="#"><i class="fa fa-bars"></i></a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="#" class="nav-link">Home</a>
            </li>
        </ul>

        <!-- Right navbar links -->
        <ul class="navbar-nav ml-auto">
            <!-- Notifications Dropdown Menu -->
            <li class="nav-item dropdown">
                <a class="nav-link" data-toggle="dropdown" href="#">
                    <i class="fa fa-user"></i>
                </a>
                <div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
                    <span class="dropdown-item dropdown-header" >早上好，用户<span th:text="${managerNumber}"></span></span>
                    <div class="dropdown-divider"></div>
                    <a href="/login/cancellation" class="dropdown-item">
                        <i class="fa fa-sign-out"></i> 用户注销
                    </a>
                    <div class="dropdown-divider"></div>
						<a href="#" class="dropdown-item" data-toggle="modal"
							data-target="#changePassword"> <i class="fa fa-address-card"></i>
							修改密码
						</a>
					</div></li>
				<li class="nav-item"><a class="nav-link"
					data-widget="control-sidebar" data-slide="true" href="#"><i
						class="fa fa-th-large"></i></a></li>
			</ul>
		</nav>
		<!-- 修改密码遮罩层（模态框） -->
		<div class="modal fade" id="changePassword" tabindex="-1" role="dialog"
			aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="card card-primary">
						<div class="card-header">
							<h3 class="card-title">修改密码</h3>
						</div>
						<!-- /.card-header -->
						<!-- form start -->
						<form class="form-horizontal" action="/login/changePassword" method="post" onsubmit="return changePassword()">
							<div class="card-body">
								<div class="form-group">
									<label for="inputPassword_old">旧密码</label>

									<div class="col-sm-10">
										<input type="password" class="form-control"
											id="password" name="password" placeholder="请输入当前密码">
									</div>
								</div>
								<div class="form-group">
									<label for="inputPassword_new">新密码</label>

									<div class="col-sm-10">
										<input type="password" class="form-control"
											id="newPassword_1" name="newPassword_1" placeholder="请输入新密码">
									</div>
								</div>
								<div class="form-group">
									<label for="inputPassword_conf" >确认密码</label>

									<div class="col-sm-10">
										<input type="password" class="form-control"
											id="newPassword_2" name="newPassword_2" placeholder="请确认新密码">
									</div>
								</div>
							</div>
							<!-- /.card-body -->
							<div class="modal-footer">
								<button type="button" class="btn btn-default"
									data-dismiss="modal">关闭</button>
								<button type="submit" class="btn btn-primary">提交更改</button>
							</div>
						</form>
					</div>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal -->
		</div>
    <!-- 头部 -->

    <!-- 侧边栏 -->
    <aside class="main-sidebar sidebar-dark-primary elevation-4">
        <!-- Brand Logo -->
        <a href="index3.html" class="brand-link">
            <img src="../../util/AdminLTE/dist/img/AdminLTELogo.png" alt="AdminLTE Logo"
                 class="brand-image img-circle elevation-3"
                 style="opacity: .8">
            <span class="brand-text font-weight-light">雷格发型工作室</span>
        </a>

        <!-- Sidebar -->
        <div class="sidebar">
            <!-- Sidebar user panel (optional) -->
            <div class="user-panel mt-3 pb-3 mb-3 d-flex">
                <div class="image">
                    <img src="../../util/AdminLTE/dist/img/user2-160x160.jpg" class="img-circle elevation-2" alt="User Image">
                </div>
                <div class="info">
                    <a href="#" class="d-block">Alexander Pierce</a>
                </div>
            </div>

            <!-- Sidebar Menu -->
            <nav class="mt-2">
                <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu"
                    data-accordion="false">
                    <!-- Add icons to the links using the .nav-icon class
                         with font-awesome or any other icon font library -->
                    <li class="nav-header">客户</li>
                    <li class="nav-item">
                        <a href="/customer/" class="nav-link">
                            <i class="nav-icon fa fa-user"></i>
                            <p>
                                客户信息管理
                            </p>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="/payList/" class="nav-link">
                            <i class="nav-icon fa fa-credit-card"></i>
                            <p>
                                客户充值
                            </p>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="/record/" class="nav-link">
                            <i class="nav-icon fa fa-bars"></i>
                            <p>
                                客户服务结算
                            </p>
                        </a>
                    </li>
                    <li class="nav-header">员工</li>
                    <li class="nav-item has-treeview menu-open">
                        <a href="#" class="nav-link active">
                            <i class="nav-icon fa fa-users"></i>
                            <p>
                                员工管理
                                <i class="right fa fa-angle-left"></i>
                            </p>
                        </a>
                        <ul class="nav nav-treeview">
                            <li class="nav-item">
                                <a href="/employeeType/" class="nav-link">
                                    <i class="fa fa-circle-o nav-icon"></i>
                                    <p>员工类型管理</p>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="/employeeManage/" class="nav-link active">
                                    <i class="fa fa-circle-o nav-icon"></i>
                                    <p>员工信息管理</p>
                                </a>
                            </li>
                        </ul>
                    </li>
                    <li class="nav-header">服务</li>
                    <li class="nav-item">
                        <a href="/serviceItem/" class="nav-link">
                            <i class="nav-icon fa fa-print"></i>
                            <p>
                                服务项目管理
                            </p>
                        </a>
                    </li>
                    <li class="nav-header">统计</li>
                    <li class="nav-item">
                        <a href="/count/salary" class="nav-link">
                            <i class="nav-icon fa fa-calendar"></i>
                            <p>
                                统计工资结算
                            </p>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="/count/statistics" class="nav-link">
                            <i class="nav-icon fa fa-usd"></i>
                            <p>
                                统计盈收
                            </p>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a href="/expense/" class="nav-link ">
                            <i class="nav-icon fa fa-usd"></i>
                            <p>
                                支出项目统计
                            </p>
                        </a>
                    </li>
                </ul>
            </nav>
            <!-- /.sidebar-menu -->
            <!-- /.sidebar-menu -->
        </div>
        <!-- /.sidebar -->
    </aside>
    <!-- 侧边栏 -->

    <!-- 主体内容 -->
    <div class="content-wrapper">
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>员工详情</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="#">员工</a></li>
                            <li class="breadcrumb-item active">员工管理</li>
                            <li class="breadcrumb-item active">员工信息管理</li>
                            <li class="breadcrumb-item active">员工详情</li>
                        </ol>
                    </div>
                </div>
            </div><!-- /.container-fluid -->
        </section>

        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">
                        <div class="card card-primary">
                            <div class="card-header">
                                <h3 class="card-title">员工信息</h3>
                            </div>
                            <!-- /.card-header -->
                            <!-- form start -->
                            <form role="form" id="employeeManage" class="form-horizontal" onsubmit="return edit()" action="/employeeManage/insertEmployeeManage" method="post" enctype="multipart/form-data" >
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-xs-12 col-md-4">
                                                <div class="form-group">
                                                    <label for="exampleInputFile">用户头像</label>
                                                    <div>
                                                        <img src="../util/AdminLTE/dist/img/user2-160x160.jpg" alt="photo">
                                                    </div>
                                                    <div class="input-group">
                                                        <div class="custom-file">
                                                            <input type="file" class="file custom-file-input" id="exampleInputFile" name="file">
                                                            <label class="custom-file-label" for="exampleInputFile">选择文件</label>
                                                        </div>
                                                    </div>
                                            </div>
                                        </div>
                                        <div class="col-xs-12 col-md-8">
                                            <div class="row">
                                                <div class="col-md-4">
                                                    <div class="form-group">
                                                        <label for="">员工工号</label>
                                                        <input name="number" id="number" class="form-control" value="" placeholder="请输入员工工号">
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label for="">员工手机号</label>
                                                        <input name ="phone" class="form-control" value="" placeholder="请输入员工手机号">
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label for="">员工姓名</label>
                                                        <input name="name" class="form-control" value="" placeholder="请输入员工姓名">
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label>员工类型</label>
                                                        <select id="typeSelect"  name="typeId" id="typeId" class="form-control select2 select2-hidden-accessible"tabindex="-1" aria-hidden="true">
                                                            <option selected="selected" value="">--员工类型--</option>
															<option th:each=" lst : ${listet}" th:value="${lst.id}" th:text="${lst.name}">洗发技师</option>
                                                            </select>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4" id="password">
                                                    <div class="form-group">
                                                        <label for="exampleInputPassword1">密码</label>
                                                        <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label for="exampleInputPassword1">性别</label>
                                                        <div class="form-check">
                                                            </select>
                                                            <input  name="sex" class="form-check-input" type="radio" value="男" checked="checked">
                                                            <label class="form-check-label">男</label>
                                                        </div>
                                                        <div class="form-check">
                                                            <input  name="sex" class="form-check-input" type="radio" value="女">
                                                            <label class="form-check-label">女</label>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-xs-12 col-md-4">
                                                    <div class="form-group">
                                                        <label>是否在职</label>
                                                        <select class="form-control select2 select2-hidden-accessible"tabindex="-1" aria-hidden="true">
                                                            <option selected="selected" value="">--在职状况--</option>
                                                            <option value="在职">在职</option>
                                                            <option value="离职">离职</option>
                                                        </select>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- /.card-body -->
                       
                                </div>
                                <!-- /.card-body -->

                                <div class="card-footer">
                                    <button type="submit" class="btn btn-primary">提交</button>
                                    <span id="span_edit1" style="color: red;"></span>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
    <!-- 主体内容 -->

    <!--底部版权信息-->
    <footer class="main-footer">
        <strong>Copyright &copy; 2018-05-03 <a href="https://coding.net/u/leige123321/p/HairCut/git?public=true">项目主页</a>.</strong>
        All rights reserved.
        <div class="float-right d-none d-sm-inline-block">
            <b>雷格</b> 发型工作室
        </div>
    </footer>
    <!--底部版权信息-->

</div>

<!-- jQuery -->
<script src="../util/AdminLTE/plugins/jquery/jquery.min.js"></script>
<!-- jQuery UI 1.11.4 -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
    $.widget.bridge('uibutton', $.ui.button)
</script>
<!-- Bootstrap 4 -->
<script src="../util/AdminLTE/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- DataTables -->
<script src="../util/AdminLTE/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="../util/AdminLTE/plugins/datatables/dataTables.bootstrap4.min.js"></script>
<!-- Morris.js charts -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script>
<script src="../util/AdminLTE/plugins/morris/morris.min.js"></script>
<!-- Sparkline -->
<script src="../util/AdminLTE/plugins/sparkline/jquery.sparkline.min.js"></script>
<!-- jvectormap -->
<script src="../util/AdminLTE/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="../util/AdminLTE/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<!-- jQuery Knob Chart -->
<script src="../util/AdminLTE/plugins/knob/jquery.knob.js"></script>
<!-- daterangepicker -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.2/moment.min.js"></script>
<script src="../util/AdminLTE/plugins/daterangepicker/daterangepicker.js"></script>
<!-- datepicker -->
<script src="../util/AdminLTE/plugins/datepicker/bootstrap-datepicker.js"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="../util/AdminLTE/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<!-- Slimscroll -->
<script src="../util/AdminLTE/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="../util/AdminLTE/plugins/fastclick/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="../util/AdminLTE/dist/js/adminlte.min.js"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="../util/AdminLTE/dist/js/pages/dashboard.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="../util/AdminLTE/dist/js/demo.js"></script>
<script>
function edit() {
    var number = document.getElementById('number').value;
    var typeId = document.getElementById('typeId').value;

    if (number == ""){
        document.getElementById("span_edit1").innerHTML='请输入客户账户';
        return false;
    }else if (typeId == ""){
        document.getElementById("span_edit1").innerHTML='请输入员工类型';
        return false;
    }
    return true;

}
    function showPassword() {
        var tid = $("#password").find("option:selected").text();
        target=document.getElementById('password');//通过id获取密码框div对象
        if (tid == '店长'){
            target.style.display="block";
        }else {
            target.style.display="none";
        }
    }
    $(document).on("change","#typeSelect",function(){     //获取整个网页文档对象（类似的于window.document）
        //alert('value：'+$(this).val());//获取value
        var tid=$(this).val(); //获取选中的value值
        target=document.getElementById('password');//通过id获取密码框div对象
        if (tid == '店长'){
            target.style.display="block";
        }else {
            target.style.display="none";
        }
    });
</script>
</body>
</html>